<template>
	<view class="box">
		<!-- <van-toast id="van-toast" /> -->
		<view class="">
			<van-nav-bar title="购买宝贝" left-text="返回" left-arrow @click-left="onClickLeft" />
		</view>
		<view class="goods" v-for="(a,index) in splist" :key="index">
			<view class="goodsimg">
				<img :src="a.commodityImg">
			</view>
			<view class="">
				<view class="describe">
					{{a.describe}}
				</view>
				<view class="money">
					￥{{a.currentPrice}}
				</view>
			</view>
		</view>
		<view class="box2">
			<view class="">
				<van-cell-group>
					<van-cell title="收货地址" value="内容" @click="adds" />
					<view class="yunf">
						<text style="margin-left: 15px;">运费</text>
						<text style="margin-left: 155px;color: red;font-weight: 700;">￥0.00</text>
					</view>
				</van-cell-group>
			</view>
		</view>
		<view class="affirm">
			<view class="kk">
				<view class="sf">
					实付款:<text style="color: red;">￥</text><text class="q">{{splist[0].currentPrice}}</text>
				</view>
				<view class="tijiao" @click="order">
					确认购买
				</view>
			</view>
		</view>
		<view class="">
			<van-popup :show="show" closeable position="bottom" custom-style="height: 60%" @close="onClose">
				<view class="dz" v-for="(item,index) in sitelist" :key="index" @click="selectadd(item)">
					<view class="mz">
						<text style="font-weight: 700;">{{item.person}}</text><text
							style="color: lightgrey;">{{item.personPhone}}</text>
					</view>
					<view class="hhh">
						<text>{{item.province}}</text>
						<text>{{item.city}}</text>
						<text>{{item.district}}</text>
						<text>{{item.address}}</text>
					</view>
				</view>
			</van-popup>
		</view>
	</view>
</template>

<script>
	import request from "../../com/request.js";
	// import Toast from "../../wxcomponents/vant/toast/index";

	export default {
		data() {
			return {
				province: '',
				city: '',
				area: '',
				minute: '',
				xianshi: false,
				spid: uni.getStorageSync('hx220408commodityId'),
				userTel: uni.getStorageSync('userTel'),
				splist: [],
				show: false,
				sitelist: [],
				selectlist: [],
			}
		},
		methods: {
			onClickLeft() {
				// this.$Toast('返回');
				uni.navigateBack({
						delta:1,//返回层数，2则上上页
					})
				
			},
			onClose() {
				this.show = false;
			},
			adds() {
				this.show = true;
			},
			comm() {
				console.log(this.spid, 61)
				var that = this
				request({
					url: "api/commodityTable/minute",
					data: {
						commodityId: this.spid,
					},
					method: "GET",
					dataType: 'json',
					success: function(resp) {
						console.log(resp.data.data, 101)
						that.splist = resp.data.data
					}
				})
			},
			//提交订单方法
			order() {
				console.log(111)
				var that = this
				if(this.selectlist.length<=0){
					uni.showToast({
						title: '请选择收货地址',
						duration: 500,
						icon: 'none',
					});
				}else{
					
				
				request({
					url: 'api/orderTable/payment',
					method: "POST",
					data: {
						commodityId: that.spid,
						buyerTel: that.userTel,
						sellerTel: that.splist[0].userTel,
						addressid: that.selectlist.addressId,
						orderPrice: that.splist[0].currentPrice,
						category: that.splist[0].isno,
					},
					success: function(resp) {
						
						console.log(resp.data.data,2222)
						uni.navigateTo({
						  url:"/pages/close/close",
						})
						if (that.splist[0].isno == 1) {
							uni.setStorageSync('orderId', JSON.stringify({
								id: resp.data.data1,
								type: 1
							}))
						} else {
							uni.setStorageSync('orderId', JSON.stringify({
								id: resp.data.data1,
								type: 2
							}))
						}
					},
					// fail(err){
						
					// }
				})
				}
			},
			dzxx() {
				var that = this
				request({
					url: "api/viewAddress/gets",
					data: {
						acc: that.userTel,
					},
					methods: "GET",
					dataType: "json",
					success: function(resp) {
						console.log(resp.data.data, 11111111)
						that.sitelist = resp.data.data
					},
					fail(err){
						console.log(err)
					}
				});
			},
			selectadd(item) {
				this.selectlist = item;
				// this.active1 = index;
				console.log(this.selectlist)
				this.show = false;
				console.log(this.selectlist.addressId,8999)
				// console.log(index);
			},
		},
		onLoad() {
			
			this.comm()
			this.dzxx()
		}
	}
</script>

<style>
	text {
		font-size: 12px;

	}

	.box {

		background-color: #F2F2F2;
	}

	.goods {
		/* margin-top: 103px; */
		display: flex;
		margin: 15rpx auto;
		background-color: white;
		width: 570rpx;
		height: 200rpx;
		/* border: 1px solid red; */
		border-radius: 10px;
	}

	.goodsimg {
		width: 250rpx;
		height: 200rpx;
	}

	.goodsimg img {
		width: 150rpx;
		height: 150rpx;
		line-height: 250rpx;
	}

	.describe {
		width: 400rpx;
		height: 70rpx;
		font-size: 30rpx;
	}

	.money {
		width: 380rpx;
		text-align: end;
		color: red;
		line-height: 200rpx;
		font-weight: 700;
	}

	.box2 {
		width: 570rpx;
		height: 200rpx;
		/* border: 1px solid red; */
		margin: auto;
		border-radius: 10px;
		margin-top: 10px;

	}

	.van-cell {
		border-radius: 10px 10px 0px 0px;
	}

	.yunf {
		width: 570rpx;
		height: 95rpx;
		/* border: 1px solid lawngreen; */
		line-height: 95rpx;
		background-color: white;
		border-radius: 0px 0px 10px 10px;
	}

	.affirm {
		width: 750rpx;
		height: 100rpx;
		/* border: 1px solid red; */
		margin-top: 450rpx;
		background-color: white;
		line-height: 100rpx;
		/* text-align: end; */
	}

	.tijiao {
		width: 200rpx;
		height: 80rpx;
		background-color: red;
		color: white;
		border-radius: 40px;
		text-align: center;
		line-height: 80rpx;
	}

	.sf {
		line-height: 80rpx;
	}

	.kk {
		display: flex;
		justify-content: flex-end;
	}

	.q {
		font-size: 16px;
		color: red;
		font-weight: 700;
	}

	.dz {
		width: 555rpx;
		height: 250rpx;
		/* border: 1px solid #96A4C4; */
		background-image: url(https://img.alicdn.com/tps/i2/T1VPiBXvpeXXbjLKQ7-237-106.png);
		margin: auto;

	}

	.hhh text {
		margin-top: 100rpx;
		margin-left: 10rpx;
	}

	.mz {
		margin-top: 10rpx;
		margin-left: 10rpx;
		height: 50rpx;
	}
</style>
